<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>个人中心</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <link rel="stylesheet" href="css/public.css" media="all">
    <style>
        body {
            background-color: #ffffff;
        }
    </style>
</head>
<body>
<!--导航-->
<div style="margin: auto 0;">123</div>
<div class="layui-layout layui-layout-admin" th:fragment="hade">
    <div class="layui-header layui-bg-blue">
        <div class="layui-logo layui-hide-xs layui-bg-black">高校勤工助学平台</div>
        <!-- 头部区域（可配合layui 已有的水平导航） -->
        <ul class="layui-nav layui-layout-left" lay-filter="navleft">
            <!-- 移动端显示 -->
            <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
                <i class="layui-icon layui-icon-spread-left"></i>
            </li>
            <li class="layui-nav-item layui-hide-xs" ><a href="/toQzIndex">首页</a></li>
            <li class="layui-nav-item layui-hide-xs" ><a href="/toGwsqIndex" id="gwsq">岗位申请</a></li>
            <li class="layui-nav-item layui-hide-xs">
                <a href="javascript:;">我的申请</a>
                <dl class="layui-nav-child"> <!-- 二级菜单 -->
                    <dd><a href="/toWdsqIndex">正在申请</a></dd>
                    <dd><a href="/toWdsqIndex1">申请结果</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item layui-hide-xs" ><a href="/toQzCenter" id="grzx">个人中心</a></li>
            <li class="layui-nav-item layui-hide-xs" >
                <a href="javascript:;">联系反馈</a>
                <dl class="layui-nav-child" >
                    <dd><a lay-event="fankui">反馈信息</a></dd>
                    <dd>
                        <a >微信扫一扫</a>
                        <img style="width: 200px;height: 200px;" src="img/公众号1.jpg">
                    </dd>
                </dl>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right" lay-filter="demo">
            <li class="layui-nav-item layui-hide layui-show-md-inline-block">
                <a href="javascript:;">
                    <img src="//cdn.ilayuis.com/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" tppabs="http://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" class="layui-nav-img">
                    <span id="roleName">用户</span>
                    <i class="layui-icon layui-icon-down layui-nav-more"></i>
                </a>
                <dl class="layui-nav-child">
                    <dd><a lay-event="change">修改密码</a></dd>
                    <dd><a href="/loginOut">退出登录</a></dd>
                </dl>
            </li>
        </ul>
    </div>


<!--内容主体区域-->
    <div class="layui-container" style="margin-top: 50px; width: 60%;">
        <form class="layui-form layuimini-form" th:object="${user}">

            <input type="hidden" name="u_id" class="layui-input" th:field="*{u_id}">
            <div class="layui-form-item">
                <label class="layui-form-label required">姓名</label>
                <div class="layui-input-block">
                    <input type="text" name="name" class="layui-input" th:field="*{name}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">性别</label>
                <div class="layui-input-block">
                    <select name="sex" id="sex" th:field="*{sex}">
                        <option value="">请输入性别</option>
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label required">年龄</label>
                <div class="layui-input-block">
                    <input type="number"  name="age" class="layui-input" th:field="*{age}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">年级</label>
                <div class="layui-input-block">
                    <input type="text" name="grade" class="layui-input" th:field="*{grade}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">学号</label>
                <div class="layui-input-block">
                    <input type="text" name="stu_id" class="layui-input" th:field="*{stu_id}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">专业</label>
                <div class="layui-input-block">
                    <input type="text" name="major" class="layui-input" th:field="*{major}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">电话</label>
                <div class="layui-input-block">
                    <input type="text" name="phone_number" class="layui-input" th:field="*{phone_number}">
                </div>
            </div>
    <!--        <div class="layui-form-item">-->
    <!--            <label class="layui-form-label">头像</label>-->
    <!--            <div class="layui-input-block">-->
    <!--                &lt;!&ndash; 上传按钮 &ndash;&gt;-->
    <!--                <button type="button" class="layui-btn layui-btn-primary" id="upload1">-->
    <!--                    上传图片-->
    <!--                </button>-->
    <!--                <input type="hidden" id="photo" name="photo" value=""/>-->
    <!--                &lt;!&ndash; 预览区域 style="display: none;"&ndash;&gt;-->
    <!--                <div id="imgDiv" class="layui-upload-list" style="display: none;">-->
    <!--                    <img class="layui-upload-img" width="100px" height="80px" id="demo1" name="msg" />-->
    <!--                    <p id="demoText"></p>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>-->
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
                </div>
            </div>
        </form>
    </div>
</div>


<script src="lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script>
    layui.use(['element','form','upload'], function () {
        var form = layui.form,
            element=layui.element,
            layer = layui.layer,
            upload = layui.upload,
            $ = layui.$;

        $(function(){
            $.post("../getusername",function(obj){
                $("#roleName").html(obj.name);
            },"json")
        });

        // //图片上传
        // var uploadInst = upload.render({
        //     elem: '#upload1'
        //     ,url: '/uploadFile'
        //     ,before: function(obj){
        //         //预读本地文件示例，不支持ie8
        //         obj.preview(function(index, file, result){
        //             $('#demo1').attr('src', result); //图片链接（base64）
        //         });
        //     }
        //     ,done: function(res){
        //         //如果上传失败
        //         if(res.code > 0){
        //             layer.msg('上传失败');
        //         }
        //         //上传成功
        //         layer.msg('上传成功');
        //         //将图片的名字放在表单中，添加的时候得放在数据库里面
        //         $(function(){
        //             $("#photo").val(res.msg);
        //             $("#imgDiv").css("display","")// 显示图片框
        //             //alert('赋值成功');
        //         })
        //     }
        //     ,error: function(){
        //         //演示失败状态，并实现重传
        //         var demoText = $('#demoText');
        //         demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
        //         demoText.find('.demo-reload').on('click', function(){
        //             uploadInst.upload();
        //         });
        //     }
        // });


        //监听提交
        form.on('submit(saveBtn)', function (data) {
        var params = data.field;
            $.ajax({
                type: 'POST',
                url: window.location.protocol + '//' + window.location.host + '/updateUserData',
                dataType: 'html',
                data: JSON.stringify(params),
                contentType: 'application/json',
                success: function (data) {
                    parent.layer.msg("资料修改成功");

                    setTimeout( function(){
                        window.location.href = 'toQzIndex';   //登录成功进行主页面
                    }, 2 * 1000 );//延迟2秒

                    // var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    // parent.layer.close(index); //再执行关闭
                },
                error: function () {
                    //console.log(data);
                    // layer.close(registerLoadIndex);
                    layer.alert("系统异常，请稍后重试！！")
                }
            });
            return false;
        });
    });
</script>
<script src="js/nav.js"></script>
</body>
</html>